import ReactDOM from 'react-dom/client';
import React from 'react';
import App from './App';

// 新时代的前端开发，旧时代 DOM API
// 接管 root 结点
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />);

// const element = React.createElement(
//   'div',
//   { className: 'container' },
//   React.createElement('header', { className: 'header' }, 'Hello World!'),
//   React.createElement(
//     'main',
//     { className: 'main' },
//     React.createElement('aside', { className: 'aside' }, 'aside'),
//     React.createElement('article', { className: 'article' }, 'article'),
//     React.createElement('aside', { className: 'aside' }, 'aside')
//   ),
//   React.createElement('footer', { className: 'footer' }, 'footer')
// );
// JSX react 表现力优于vue
// React Element VDOM(全新打造的react结点)    不是 DOM element
// const element = (
//   <div className="container">
//     <header className="header">Hello World!</header>
//     <main className="main">
//       <aside className="aside">aside</aside>
//       <article className="article">article</article>
//       <aside className="aside">aside</aside>
//     </main>
//     <footer className="footer">footer</footer>
//   </div>
// );
